<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <script type="text/javascript" src="./script/rem.js"></script>
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="yes" name="apple-touch-fullscreen">
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <link rel="stylesheet" type="text/css" href="./css/font-awesome.css" />
    <link rel="stylesheet" type="text/css" href="./css/style.css" />
    <script type="text/javascript" src="./script/jquery.min.js"></script>

    <script type="text/javascript" src="./script/doT.min.js"></script>
    <script type="text/javascript" src="./script/base.js"></script>
    <script type="text/javascript" src="./script/api.js"></script>
</head>
<body>

    <header class="head" style="padding-top:0.4rem;">
        <div class="head-l" tapmode onclick="closeWin()"><i class="fa fa-angle-left"></i></div>
        <h3>订单管理详情</h3>
        <div class="head-r"></div>
    </header>
    <div class="head-d" style="padding-top:0.4rem;"></div>


    <!-- 无记录 -->
    <div class="wallet-d-no mt100" style="display: none;" id="record_id">
        <img src="image/wallet-d-no.png">
        <p>无订单详情记录啦！</p>a
    </div>
    <!-- 地址 -->


    <div>
        <div class="order-address" id="address_id">
<!--             <img src="image/address-icon.png">
            <dl style="width:calc(100% - 0.82rem)">
                <dt>张华<span>15487878728</span></dt>
                <dd>辽宁省沈阳市铁西区建设大路建设东路57号1202室</dd>
            </dl> -->
        </div>

        <div id="order_list">
<!--                 <div class="order-address-d mb20" id="order_list"></div>
                <dl class="order-t">
                    <dt>订单号：123456789056789<span>待收货</span></dt>
                    <p>姓名：张华</p> 
                    <dd>订单日期：2016-10-22   10:28</dd> 
                </dl>
                <div class="order-manage-goods mb20">
                    <ul>
                        <li>
                            <img src="image/classify.jpg">
                            <dl>
                                <dt>澳大利亚·毛孔脏东西浮出来·麦卢...</dt>
                                <dd>x22</dd>
                            </dl>
                        </li>
                        <li>
                            <img src="image/classify.jpg">
                            <dl>
                                <dt>澳大利亚·毛孔脏东西浮出来·麦卢...</dt>
                                <dd>x22</dd>
                            </dl>
                        </li>
                    </ul>
                    <div class="order-manage-d">
                        <font color="#FF0000">合计￥20000</font>
                    </div>
                </div> -->
            </div>
        </div>

        <script type="text/template" id="address_new_id">
            <img src="image/address-icon.png">
            <dl style="width:calc(100% - 0.82rem)">
                <dt>{{=it.data.address.name}}<span>{{=it.data.address.phone}}</span></dt>
                <dd>{{=it.data.address.address}}</dd>
            </dl>
        </script>

        <script type="text/template" id="order_list_new">

            <dl class="order-t">
                <dt>订单号：{{=it.pay_number}}<span>{{=it.action.status_str}}</span></dt>
                <p>姓名：{{=it.address.name}}</p> 
                <dd>订单日期：{{=it.create_time}}</dd> 
            </dl>
            <div class="order-manage-goods mb20">
                <ul>
                    {{~it.cart:value:index}}
                    <li>
                        <img src="{{=value.product.image}}">
                        <dl>
                            <dt>{{=value.product.title}}</dt>
                            <dd>x{{=value.number}}</dd>
                        </dl>
                    </li>
                    {{~}}
                </ul>
                <div class="order-manage-d">
                    <font color="#FF0000">合计￥{{=it.price_total}}</font>
                    <span class="on" onclick="handleOrder({{=it.id}});">删除订单</span>
                </div>
            </div>

        </script>


    </body>
    <script type="text/javascript" src="./script/api.js"></script>
    <script type="text/javascript" src="./script/index.js"></script>
    <script type="text/javascript">
        apiready = function(){
        // alert(api.pageParam.id);
        order_list(api.pageParam.id);
        address_list(api.pageParam.id);
    }

    function order_list(id){
        var token = $api.getStorage('token');
        api.ajax({
            url: webAddress + '/api/order/'+id+'/show',
            method: 'get',
            data: {
                values: {
                },
            },
            headers: {
                Authorization: 'Bearer ' + token,
                Accept: 'application/json',
            },
        },function(ret, err){
            if (ret) {
                // alert( JSON.stringify( ret.data ) );
                if(ret.data){
                    $api.byId('record_id').style.display='none';
                    // // $api.byId('order_list').style.display='block';
                    // var array = ret.data;
                    // // alert( JSON.stringify( array ) );

                    // var new_array = new Array();
                    // for (var i = 0; i < array.length; i++) {
                    // // alert( JSON.stringify( array[0] ) );

                    // if(array[i].id == id){
                    //     new_array[i] = array[i];
                    //         // alert(JSON.stringify( new_array ))
                    //     }
                    // }

                    var order = $api.byId('order_list_new');
                    var dotFn = doT.template(order.innerHTML);
                    var html = dotFn(ret.data);
                    var order_list = $api.byId('order_list');
                    $api.html(order_list, html);
                }else{
                   $api.byId('record_id').style.display='block'; 
               }           
           } else {
            // alert( JSON.stringify( err ) );
        }
    });
    }

    function address_list(order_id){

        var token = $api.getStorage('token');
        api.ajax({
            url: webAddress + '/api/user/order/'+ order_id +'/show',
            method: 'get',
            data: {
                values: { 
                },            
            },
            headers: {
                Authorization: 'Bearer ' + token,
                Accept: 'application/json',
            },
        },function(ret, err){
            if (ret) {
                // alert( JSON.stringify( ret ) );
                var address_new_id = $api.byId('address_new_id');
                var dotFn = doT.template(address_new_id.innerHTML);
                var html = dotFn(ret);
                var address_id = $api.byId('address_id');
                $api.html(address_id, html);
            } else {
                // alert( JSON.stringify( err ) );
            }
        });
    }

    // 处理订单
    function handleOrder(id){

        api.confirm({
            title: '提示!',
            msg: '是否删除订单?',
            buttons: ['确定', '取消']
        }, function(ret, err){
            if( ret ){
             // alert( JSON.stringify( ret ) );
             if (ret.buttonIndex == 1) {
                var token = $api.getStorage('token');
                api.ajax({
                    url: webAddress + '/api/order/'+id+'/delete',
                    method: 'get',
                    data: {
                        values: {
                            id:id
                        },
                    },
                    headers: {
                        Authorization: 'Bearer ' + token,
                        Accept: 'application/json',
                    },
                },function(ret, err){
                    if (ret) {
                        // alert( JSON.stringify( ret ) );
                        if (ret.status_code == 200) {
                            api.toast({
                                msg: ret.message,
                                duration: 2000,
                                location: 'bottom'
                            });
                            // loadData(0,type);

                            var setSele = 'order_list();';
                            api.execScript({
                                name: 'order_manage',
                                script: setSele,
                            });
                            api.closeWin();
                        }
                    } else {
                        // alert( JSON.stringify( err ) );
                        api.toast({
                            msg: err.body.message,
                            duration: 2000,
                            location: 'bottom'
                        });
                        return false;
                    }
                });
            }
        }else{
             // alert( JSON.stringify( err ) );
             api.toast({
                msg: err.body.message,
                duration: 2000,
                location: 'bottom'
            });
             return false;
         }
     });

    }

    function shop_order_pay() {
        api.openWin({
            name: 'shop_order_pay',
            url: './shop_order_pay.html',
        });
    }
    function address() {
        api.openWin({
            name: 'address',
            url: './address.html',
        });
    }
    function closeWin(){
        api.closeWin({
        });
    }
</script>
</html>